<template>
	<view class="blindbox-filter" :class="{'blindbox-filter-top':isTop}" v-if="isShow">
		<view class="mask" :style="{height:`${maskHeight}rpx`}" @click.stop></view>
		<slot></slot>
	</view>
</template>

<script>
	export default {
		name: 'FilterTable',
		props: {
			isShow:{
				type:Boolean,
				default:false
			},
			isTop:{
				type:Boolean,
				default:false
			},
			maskHeight:{
				type:Number,
				default:500
			}
		}
	}
</script>

<style lang="scss" scoped>
.blindbox-filter-top{
	width: 100%;
	height: 300rpx;
	background-color: #FFFFFF;
	@include center;
	position: fixed !important;
	top: 135rpx !important;
}
.blindbox-filter{
	width: 100%;
	height: 300rpx;
	background-color: #FFFFFF;
	@include center;
	position: absolute;
	top: 485rpx;
	z-index: 998;
	
	.mask{
		position: absolute;
		top: 300rpx;
		left: 0;
		width: 100%;
		z-index: 998;
		background-color: rgba(0, 0, 0, .7);
	}
}
</style>
